<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<c:set var="basePath" value="${pageContext.request.contextPath}"></c:set>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>订单详情</title>
</head>
<!-- css -->
<style type="text/css">
    /* 清除默认样式 */
    body, dd, div, dl, dt, form, h1, h2, h3, h4, h5, h6, html, input, li, ol, p, select, td, textarea, th, ul {
        margin: 0;
        padding: 0
    }

    * {
        box-sizing: border-box
    }

    body, html {
        min-height: 100%
    }

    body {
        font-family: "Microsoft YaHei";
        font-size: .8rem;
        color: #333
    }

    h1, h2, h3, h4, h5, h6 {
        font-weight: 400
    }

    ol, ul {
        list-style: none
    }

    img {
        border: none;
        vertical-align: middle
    }

    a {
        text-decoration: none;
        color: #232323
    }

    table {
        border-collapse: collapse;
        table-layout: fixed
    }

    input, textarea {
        outline: 0;
        border: none
    }

    body {
        width: 100%;
        height: 100%
    }

    div {
        width: 90%;
        margin: 0 auto;
        margin-top: 1rem;
        box-shadow: 0px 0px 10px 1px #acacac;
        box-shadow: 0px 0px 0.5rem 0.05rem #acacac;
        font-size: 16px;
        font-size: .8rem
    }

    tr {
        height: 50px;
        height: 2.5rem;
        width: 90%;
        color: #acacac;
        font-weight: 600;
        word-wrap: break-word;
        word-break: normal
    }

    .td {
        width: 20%;
        text-align: center
    }

    td {
        width: 80%
    }
</style>
<!-- 主体内容 -->
<body>
<div>
    <table cellspacing="0" width="100%">
        <tr>
            <td class="td">订单编号:</td>
            <td id="orderNo">${washCarOrder.orderNo}</td>
        </tr>
        <tr>
            <td class="td">洗车类型:</td>
            <td id="serverType"></td>
        </tr>
        <tr>
            <td class="td">洗车信息:</td>
            <td id="carInfo">${washCarOrder.carInfo}</td>
        </tr>
        <tr>
            <td class="td">洗车时间:</td>
            <td id="washTime"></td>
        </tr>
        <tr>
            <td class="td">客户名称:</td>
            <td id="userName">${washCarOrder.userName}</td>
        </tr>
        <tr>
            <td class="td">客户电话:</td>
            <td id="userPhone">${washCarOrder.userPhone}</td>
        </tr>
        <tr>
            <td class="td">洗车地址:</td>
            <td id="washAddress">${washCarOrder.washAddress}</td>
        </tr>
    </table>
</div>
</body>
</html>
<!--引入jquery -->
<script type="text/javascript" src="${basePath}/js/plugin/jquery-2.1.0.min.js"></script>
<script src="${basePath}/js/DateFormate.js"></script>
<script>
   /* o.id, o.orderNo, o.userId, o.status, o.serverType, o.serviceStatus, o.washStartTime,
        o.washEndTime, o.orderType, o.washAddress, o.carInfo, o.money, o.discounts, o.latitude,
        o.longitude, o.note, o.comment, o.createUser, o.createTime, o.updateUser, o.updateTime*/
    $(function () {
        var washCarOrder = {
            userName: '${washCarOrder.userName}',
            userPhone: '${washCarOrder.userPhone}',
            orderNo: '${washCarOrder.orderNo}',
            status: '${washCarOrder.status}',
            serverType: '${washCarOrder.serverType}',
            serviceStatus: '${washCarOrder.serviceStatus}',
            washStartTime: '${washCarOrder.washStartTime.time}',
            washEndTime: '${washCarOrder.washEndTime.time}',
            money: '${washCarOrder.money}',
            washAddress: '${washCarOrder.washAddress}',
            carInfo: '${washCarOrder.carInfo}',
            discounts: '${washCarOrder.discounts}',
        }

        if (washCarOrder.status == 1) {
            washCarOrder.status = '下单中';
        } else if (washCarOrder.status == 2) {
            washCarOrder.status = '待付款';
        } else if (washCarOrder.status == 3) {
            washCarOrder.status = '下单失败';
        } else if (washCarOrder.status == 4 && item.serviceStatus == 1) {
            washCarOrder.status = '待服务';
        } else if (washCarOrder.status == 4 && item.serviceStatus == 2) {
            washCarOrder.status = '服务中';
        } else if (washCarOrder.status == 4 && item.serviceStatus == 3) {
            washCarOrder.status = '已完成';
        } else if (washCarOrder.status == 5) {
            washCarOrder.status = '付款失败';
        } else if (washCarOrder.status == 6) {
            washCarOrder.status = '已取消';
        } else {
            washCarOrder.status = '未知';
        }
        var params = {
            type: "washCarOrder_serverType"   //"washCarOrder_serverType"
        };
        $.getJSON('${basePath}/dict/dict/findDictsForSelect.do', params, function (result) {
            if (result && result.code == 0) {
                for (var opt in result.data) {
                    if (result.data[opt].value == washCarOrder.serverType) {
                        washCarOrder.serverType = result.data[opt].label;
                    }
                }
                $('#serverType').text(washCarOrder.serverType);

            } else {
                washCarOrder.serverType = "未知";
            }
        })
        $('#washTime').text(formatDateTime2(new Date(parseInt(washCarOrder.washStartTime)))+" - "+formatTime(new Date(parseInt(washCarOrder.washEndTime))))


    })
</script>